import React, {useEffect, useState} from 'react'
import {View, Text} from '@tarojs/components'
import {AtIcon, AtButton} from "taro-ui";
import Taro,{navigateTo,useRouter} from "@tarojs/taro"
import './index.scss'
import {getEnv} from "../../env";
import { PaperPo } from '../../types';

export default () => {
  const paperId = useRouter().params.paperId ?? 1;
  const [data,setData] = useState<PaperPo | null>(null)
  useEffect(()=>{
    Taro.request({
      url: `${getEnv().baseUrl}/paper/${paperId}`,
      method: "GET"
    }).then(res => {
      setData(res.data);
    })
  },[paperId])
  if(!data) return  null;
  return <View>
    <View className='title wing-blank'>{data.paperName}</View>
    <View className='wing-blank'>
      <View className='paper-box'>
        <View> <AtIcon value='align-right' size='20' color='#6190E8' />&nbsp;&nbsp;试卷简介</View>
        <View className='paper-box-content'>
          <View className='paper-box-content-item'><Text
            className='paper-box-content-item-left'
          >年份：</Text><Text>{data.year}年</Text></View>
          <View className='paper-box-content-item'><Text
            className='paper-box-content-item-left'
          >类型：</Text><Text>历年真题</Text></View>

          <View className='paper-box-content-item'><Text
            className='paper-box-content-item-left'
          >总分：</Text><Text>2019年</Text></View>

          <View className='paper-box-content-item'><Text
            className='paper-box-content-item-left'
          >题数：</Text><Text>{data.questions?.length}</Text></View>

          <View className='paper-box-content-item'><Text
            className='paper-box-content-item-left'
          >时间：</Text><Text>{data.time}分钟</Text></View>


        </View>
      </View>
      {/*按钮*/}
      <View style={{marginTop: "16px"}}>
        <AtButton type='primary' onClick={() => navigateTo({url: "/pages/testPaperContent/index?paperId="+paperId})}>开始测试</AtButton>
      </View>
    </View>
  </View>
}
